<template>
	<div>
		<!-- <div class="header"><a-icon type="left" class='left'/>登录</div> -->
		<titleCommon title='登录'></titleCommon>
		<a-form :form="form" class='login_box'  @submit="handleSubmit">  
		    <a-form-item >
		      <a-input  v-decorator="[ 'loginName', { rules: [{ required: true, message: '请输入用户名!' }] }]" placeholder='请输入账号' size='large' >
		      	<a-icon slot="prefix" type="user" style="color: rgba(0,0,0,.25)" />
		      </a-input>
		    </a-form-item>
		    <a-form-item >
		      <a-input  v-decorator="[ 'password',  { rules: [{ required: true, message: '请输入密码!' }] }]" placeholder='请输入登录密码' size='large' type='password'>
		      	<a-icon slot="prefix" type="lock" style="color: rgba(0,0,0,.25)" /> 
		      </a-input>
		    </a-form-item>
		    <a-form-item>
                <a-button  :loading='btnLoading'  html-type="submit" class="w-100"  style='background-color: #1E49A5;color:#fff; height: 0.4rem;margin-top: 0.5rem'>
                  登录 
                </a-button>
            </a-form-item>
		</a-form>
	</div>
</template>

<script >
	import titleCommon from '@/components/titleCommon'
import  { loginUser }  from  '@/api/home/index'
export default {
	name:'login',
	data(){
		return {
			btnLoading:false
		}
	},
	beforeCreate() {
      this.form = this.$form.createForm(this);
    },
	created(){

	},
	methods:{
		handleSubmit(e) { 
	        let that = this
	        e.preventDefault();

	        this.form.validateFields((err, values) => {
	          if (!err) {
	            // console.log('Received values of form: ', values);
	            this.btnLoading = true
	            loginUser(values).then((res)=>{
	               that.$message.success('登录成功')

	               sessionStorage.setItem('token', res.data.token)
	               sessionStorage.setItem('tokenId', res.data.tokenId)
	               sessionStorage.setItem('username', res.data.username)

	               // console.log(that.$store)
	               // that.$store.commit("setusername",res.data.username)
	               // that.$store.commit("settoken",res.data.token)

	               that.btnLoading = false
	               // this.$store.commit("setlogin_visible",false)

	               that.$router.push('/home') 
	               
	            })
	            .catch(error=>{
	                this.btnLoading = false
	            })
	          }
	        });
	    },
	},
	components:{
		titleCommon
	}
}
</script>
<style scoped="scoped">
.login_box{padding: 0.4rem 0.15rem 0}
</style>